<template>
	<view class="home">
		<view class="banner">
			<image src="@/static/images/banner.png" mode=""></image>
		</view>
		<view class="content">
			<view class="row">
				<view class="left item1" @click="onClick">
					<view class="title1">国内机票</view>
					<view class="title2">国内航空机票订购</view>
				</view>
				<view class="right">
					<view class="ticket-item mb-20 item2">
						<view class="title1">国内机票</view>
						<view class="title2">全球机票订购</view>
					</view>
					<view class="ticket-item item3">
						<view class="title1">火车票</view>
						<view class="title2">铁路列车票订购</view>
					</view>
				</view>
			</view>
			<view class="row">
				<view class="left ticket-item item4">
					<view class="title1">贵宾厅</view>
					<view class="title2">商务休息室</view>
				</view>
				<view class="right ticket-item item5">
					<view class="title1">跟团旅游</view>
					<view class="title2">旅游攻略路线</view>
				</view>
			</view>
			<view class="row">
				<view class="left ticket-item item6">
					<view class="title1">航班动态</view>
					<view class="title2">航班实时路线</view>
				</view>
				<view class="right ticket-item item7">
					<view class="title1">值机选座</view>
					<view class="title2">值机预选座位</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
import { ref, onMounted, onUnmounted } from "vue";
import { GetSearchPolicyPrice} from '@/api/login.js'
import { log } from "console";
const onClick = () => {
	uni.navigateTo({
		url: "/pages/flight-inquiry/flight-inquiry",
	});
};
const getData =async ()=>{
	const result = await GetSearchPolicyPrice()
	console.log(result);
}
getData()



</script>

<style scoped lang="scss">
.home {
	.banner {
		image {
			width: 100%;
		}
	}

	.content {
		position: relative;
		top: -20px;
		background: #FFFFFF;
		border-radius: 32rpx 32rpx 0 0;
		padding: 26rpx;

		.row {
			width: 100%;
			display: flex;
			margin-bottom: 20rpx;

			.left {
				width: 50%;
				margin-right: 20rpx;
			}

			.item1 {
				color: #fff;
				padding: 10rpx;
				text-align: center;
				padding-top: 20rpx;

				.title2 {
					color: #fff;
					font-size: 24rpx;
				}
			}

			.right {
				width: 50%;
			}

			.title1 {
				font-size: 30rpx;
				font-weight: 700;
				margin-bottom: 10rpx;
			}

			.ticket-item {
				border-radius: 32rpx;
				height: 146rpx;
				padding: 30rpx 0 0 30rpx;
				box-sizing: border-box;

				.title2 {
					color: rgba(27, 58, 113, 0.5);
					font-size: 22rpx;
				}
			}

			.mb-20 {
				margin-bottom: 20rpx;
			}

		}

		.item1 {
			background: url('@/static/images/item1.png') no-repeat;
			background-size: 100% 100%;
		}

		.item2 {
			background: url('@/static/images/item2.png') no-repeat;
			background-size: 100% 100%;
		}

		.item3 {
			background: url('@/static/images/item3.png') no-repeat;
			background-size: 100% 100%;
		}

		.item4 {
			background: url('@/static/images/item4.png') no-repeat;
			background-size: 100% 100%;
		}

		.item5 {
			background: url('@/static/images/item5.png') no-repeat;
			background-size: 100% 100%;
		}

		.item6 {
			background: url('@/static/images/item6.png') no-repeat;
			background-size: 100% 100%;
		}

		.item7 {
			background: url('@/static/images/item7.png') no-repeat;
			background-size: 100% 100%;
		}
	}
}
</style>